// 测试
import Vue from 'vue'

// 功能类似于 base.css 用于初始化css样式 => 样式兼容
import 'normalize.css/normalize.css'

// 全部导入element-ui
// 1. 全部导入 项目体积大 体验差; 使用方便
//    toB 管理自己人 非盈利的  用户体验没那么重要了;  项目挺大的  组件会用的7788
// 2. 按需导入 项目体积小 体验好; 使用麻烦
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

// 导入英文语言包
// import locale from 'element-ui/lib/locale/lang/en' // lang i18n

// 导入全局样式文件
import '@/styles/index.scss' // global css

import App from './App'
import store from './store'
import router from './router'

// 直接导入文件并执行 他不是需要文件中的数据
// 导入的是icons文件夹下的index.js
import '@/icons' // icon
// 导入的是permission.js文件
import '@/permission' // permission control
// import request from '@/utils/request'
// 我们希望将来能够和elementui一样 use以下 就把所有组件都全局注册
// Vue.use(vue的插件)  vue的插件安装语法
// { install() {} }  插件

// import PageTools from '@/components/PageTools'
// Vue.component('PageTools', PageTools)

// const obj = {
//   install() {
//     console.log('我是一个插件')
//   }
// }
// Vue.use(obj) // 一旦use后 插件的install方法调用了
import MyUI from '@/components'
Vue.use(MyUI)

// import '@/directives'
// 有没有一种方式 可以拿到一个文件中的所有的按需导出呢???
// import { imgerror, color } from '@/directives'
// 一次性拿到所有按需导出
// 导入并改名 as ;    解构 改名 :
import * as directives from '@/directives'
// console.log(directives, 6666)

import Print from 'vue-print-nb'
// console.log(Print, 888)
// Print 这个对象中的install方法 帮你全局注册了一个自定义指令 v-print
Vue.use(Print) // 安装插件

// import hello from '@/mixins/hello'
// Vue.mixin(hello)

// 对象遍历 for in    obj.name   obj['name']
// for (const key in directives) {
//   console.log(key, directives[key])
//   Vue.directive(key, directives[key])
// }
// ['imgerror', 'color']
// 这种方式遍历对象 工作中更加常用 因为数组方法更多 将来处理起来更加灵活!!
Object.keys(directives).forEach((key) => {
  Vue.directive(key, directives[key])
})

// set ElementUI lang to EN
// 你的element-ui是英文的
// Vue.use(ElementUI, { locale: locale })
// 如果想要中文版 element-ui，按如下方式声明
Vue.use(ElementUI) // 将组件库中的所有组件 全局注册
// console.log(ElementUI, 999888)

Vue.config.productionTip = false

// console.log(process.env.VUE_APP_BASE_API, 9999)

// Vue.prototype.$request = request
// this.$request

// 注册一个全局自定义指令 imgerror
// Vue.directive('imgerror', 指令的配置对象)
// Vue.directive('imgerror', imgerror)
// Vue.directive('color', color)

// 在vue的原型上挂载一个方法 用于检查按钮权限 $check
Vue.prototype.$check = function(code) {
  return store.getters.points.includes(code)
}

// Vue.prototype.$store = store
// Vue.prototype.$router = router

new Vue({
  // el: '#app',
  router,
  store,
  render: h => h(App)
}).$mount('#app')
